/* 拖拽组件 */
.drag-box::-webkit-scrollbar {
  /*滚动条整体样式*/
  width: 0;
  /*高宽分别对应横竖滚动条的尺寸*/
  height: 0;
}
.drag-box {
  width: 100%;
  flex: 1;
  overflow-x: hidden;
  /* overflow-y: scroll; */
}

.drag-item {
  width: 100%;
  position: relative;
}
.drag-item-questionnaire{
  width: 60px;
  height: 60px; 
  position: fixed;
  bottom: 225px;
  margin-left: 300px;
  z-index: 100;
}

.drag-item--select { 
  border: 1px dashed #429dff;
}

.drag-item:hover {
  border: 1px dashed #429dff;
}
/* 操作栏 */
.op-area {
  background: #fff;
  position: absolute;
  right: 0;
  top: 0;
  display: none;
  z-index: 100;
  border: 1px solid #429dff;
  border-radius: 0 0 3px 3px;
}

.op-area-item {
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.op-area .op-area-item:not(:first-child) {
  border-left: 1px solid #429dff;
}

.drag-item:hover .op-area {
  display: flex;
}
/* 表单 */
.form-item {
  display: flex;
  align-items: center;
  padding: 10px;
}
.form-label {
  width: 110px;
}
.form-explain {
  font-size: 12px;
  color: #888;
  margin-left: 10px;
} 
/* 选择模板 */ 
.module-item {
  width: 90px;
  height: 110px;
  border: 1px solid #eee;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 5px 0;
}
/* .module-item:not(:first-child) {
  margin-left: 10px;
} */
.module-item:nth-child(odd){
  margin-right: 10px;
}
.module-item--select {
  border-color: #429dff;
}
.module-item_icon {
  width: 70px;
  height: 70px;
  background: #fff;
  /* background: #e0f2f9; */
  margin: 5px 0;
}
.module-item_text {
  font-size: 12px; 
  line-height: 20px;
}
.data-item {
  width: 100%;
  border: 1px solid #eeeeee;
  margin-top: 20px;
  position: relative;
}
/* 删除模板按钮 */
.del-box {
  position: absolute;
  right: -11px;
  top: -11px;
  z-index: 20;
  background: white;
  border-radius: 50%;
}
.del-box .el-icon-circle-close {
  font-size: 24px;
}
/* 添加模板 */
.add-btn {
  width: 320px;
  height: 70px;
  display: flex;
  align-items: center;
  border: 1px solid #eeeeee;
  background: #fff;
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.add-btn_title {
  color: #429dff;
  font-size: 14px;
}
.add-btn_caption {
  color: #999;
  font-size: 12px;
  margin-top: 4px;
}
/* 选择弹窗 */
.dialog-footer-diy {
  display: flex;
  align-items: center;
}
.dialog-footer_op {
  flex: 1;
  text-align: left;
} 
.dialog-module-list {
  /* height: 70px; */
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}
.dialog-module-item {
  width: 90px;
  height: 34px;
  background: #eeeeee;
  font-size: 14px;
  color: #333;
  border-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dialog-module-item:not(:first-child) {
  margin-left: 30px;
}
.dialog-module-item--select {
  background: #429dff;
  color: #fff;
}
.dialog-left {
  width: 170px;
  height: auto;
  /* height: 400px; */
  border: 1px solid #eeeeee;
  margin-right: 20px;
}
.dialog-left_title {
  font-size: 14px;
  font-weight: bold;
  color: #333333;
  height: 40px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #eeeeee;
}
.dialog-left_item {
  color: #333333;
  height: 40px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
}
.dialog-left_item--select {
  background: #e0f2f9;
  color: #429dff;
}
/*官网页 通用标题栏 */
.web-item-title {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: white;
  border:4px solid #000000;
}
/* 名片页  通用标题栏*/
.card-item-title {
  display: flex;
  align-items: center;
  padding:10px 16px;
  font-weight: bold;
}
.card-icon-box {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #000000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.card-icon-box .iconfont{
  transform: scale(0.8);
}
/* VR全景/我的视频 */
.cover-box {
	width: 343px;
	height: 200px;
	position: relative;
}

.cover-img {
	width: 100%;
	height: 100%;
	background: #EEEEEE;
	border-radius: 7px;
}

.cover-content {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	z-index: 10;
}

.cover-btn {
	width: 75px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 14px;
	background: #eeeeee;
	font-size: 12px;
	margin-top: 10px;
}